<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<title>Bootstrap 3, from LayoutIt!</title>
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta name="description" content="">
		<meta name="author" content="">

		<!--link rel="stylesheet/less" href="less/bootstrap.less" type="text/css" /-->
		<!--link rel="stylesheet/less" href="less/responsive.less" type="text/css" /-->
		<!--script src="js/less-1.3.3.min.js"></script-->
		<!--append ‘#!watch’ to the browser URL, then refresh the page. -->

		<link href="css/bootstrap.min.css" rel="stylesheet">
		<link href="css/style.css" rel="stylesheet">

		<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
		<!--[if lt IE 9]>
    <script src="js/html5shiv.js"></script>
  <![endif]-->

		<!-- Fav and touch icons -->
		<link rel="apple-touch-icon-precomposed" sizes="144x144"
			href="img/apple-touch-icon-144-precomposed.png">
		<link rel="apple-touch-icon-precomposed" sizes="114x114"
			href="img/apple-touch-icon-114-precomposed.png">
		<link rel="apple-touch-icon-precomposed" sizes="72x72"
			href="img/apple-touch-icon-72-precomposed.png">
		<link rel="apple-touch-icon-precomposed"
			href="img/apple-touch-icon-57-precomposed.png">
		<link rel="shortcut icon" href="img/favicon.png">

		<script type="text/javascript" src="js/jquery.min.js">
</script>
		<script type="text/javascript" src="js/bootstrap.min.js">
</script>
		<script type="text/javascript" src="js/scripts.js">
</script>
	</head>

	<body>
		<div class="container">
			<div class="row clearfix">
				<jsp:include page="nav.jsp" />
				<div class="col-md-4 column">
					<div class="panel-group" id="panel-900230">
						<div class="panel panel-default">
							<div class="panel-heading">
								<a class="panel-title" data-toggle="collapse"
									style="color: black;" data-parent="#panel-900230"
									href="#panel-element-805039">闲置品类型1</a>

							</div>
							<div id="panel-element-805039" class="panel-collapse collapse in">
								<div class="panel-body">
									
									<a class="panel-title" href="goodsMessage.html?styleId=2&page=1">鞋靴</a>
									<a class="panel-title" href="goodsMessage.html?styleId=4&page=1">日用品</a>
									<a class="panel-title" data-toggle="collapse"
										data-parent="#panel-900230" href="goodsMessage.html?styleId=7&page=3">运动物品</a>
								</div>
							</div>

						</div>

						<div class="panel panel-default">
							<div class="panel-heading">
								<a class="panel-title" data-toggle="collapse"
									style="color: black;" data-parent="#panel-900230"
									href="#panel-element-439815">闲置品类型2</a>
							</div>
							<div id="panel-element-439815" class="panel-collapse collapse">
								<div class="panel-body">
									<a class="panel-title" data-toggle="collapse"
										data-parent="#panel-900230" href="goodsMessage.html?styleId=1&page=5">书籍</a>
									
									<a class="panel-title" data-toggle="collapse"
										data-parent="#panel-900230" href="goodsMessage.html?styleId=1&page=9">电器类</a>
										<a class="panel-title" data-toggle="collapse"
										data-parent="#panel-900230" href="goodsMessage.html?styleId=7&page=1">电子数码产品</a>
								</div>
							</div>
						</div>

						<div class="panel panel-default">
							<div class="panel-heading">
								<a class="panel-title" data-toggle="collapse"
									style="color: black;" data-parent="#panel-900230"
									href="#panel-element-439816">闲置品类型3</a>
							</div>
							<div id="panel-element-439816" class="panel-collapse collapse">
								<div class="panel-body">
									<a class="panel-title" href="goodsMessage.html?styleId=1&page=1">服饰</a>
									<a class="panel-title" data-toggle="collapse"
										data-parent="#panel-900230" href="goodsMessage.html?styleId=1&page=6">文具</a>
									<a class="panel-title" data-toggle="collapse"
										data-parent="#panel-900230" href="goodsMessage.html?styleId=8&page=1">电子数码配件</a>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="col-md-8 column">
					<div class="carousel slide" id="carousel-760282">
						<ol class="carousel-indicators">
							<li class="active" data-slide-to="0"
								data-target="#carousel-760282">
							</li>
							<li data-slide-to="1" data-target="#carousel-760282">
							</li>
							<li data-slide-to="2" data-target="#carousel-760282">
							</li>
						</ol>
						<div class="carousel-inner">
							<div class="item active">
								<img alt="" src="img/1.jpg">
								<div class="carousel-caption">
									<h4>
										First Thumbnail label
									</h4>
									<p>
										Cras justo odio, dapibus ac facilisis in, egestas eget quam.
										Donec id elit non mi porta gravida at eget metus. Nullam id
										dolor id nibh ultricies vehicula ut id elit.
									</p>
								</div>
							</div>
							<div class="item">
								<img alt="" src="img/2.jpg">
								<div class="carousel-caption">
									<h4>
										Second Thumbnail label
									</h4>
									<p>
										Cras justo odio, dapibus ac facilisis in, egestas eget quam.
										Donec id elit non mi porta gravida at eget metus. Nullam id
										dolor id nibh ultricies vehicula ut id elit.
									</p>
								</div>
							</div>
							<div class="item">
								<img alt="" src="img/3.jpg">
								<div class="carousel-caption">
									<h4>
										Third Thumbnail label
									</h4>
									<p>
										Cras justo odio, dapibus ac facilisis in, egestas eget quam.
										Donec id elit non mi porta gravida at eget metus. Nullam id
										dolor id nibh ultricies vehicula ut id elit.
									</p>
								</div>
							</div>
						</div>
						<a class="left carousel-control" href="#carousel-760282"
							data-slide="prev"><span
							class="glyphicon glyphicon-chevron-left"></span> </a>
						<a class="right carousel-control" href="#carousel-760282"
							data-slide="next"><span
							class="glyphicon glyphicon-chevron-right"></span> </a>
					</div>
				</div>

			</div>

			<div class="col-md-8 column">
				<h3 class="text-left">
					热门物品
				</h3>

				<div class="col-xs-6 col-md-3">
					<a href="#" class="thumbnail"> <img
							data-src="holder.js/100%x170" alt="..."
							src="img/default/goods1.jpg"> </a>
				</div>
				<div class="col-xs-6 col-md-3">
					<a href="#" class="thumbnail"> <img
							data-src="holder.js/100%x170" alt="..."
							src="img/default/goods2.jpg"> </a>
				</div>

				<div class="col-xs-6 col-md-3">
					<a href="#" class="thumbnail"> <img
							data-src="holder.js/100%x170" alt="..."
							src="img/default/goods5.jpg"> </a>
				</div>
				<div class="col-xs-6 col-md-3">
					<a href="#" class="thumbnail"> <img
							data-src="holder.js/100%x170" alt="..."
							src="img/default/goods6.jpg"> </a>
				</div>
			</div>
			<div class="col-md-4 column">
				<blockquote>
					<p>
						动态新闻
					</p>
					<small>Someone famous <cite>Source Title</cite> </small>
				</blockquote>
				<ul>
				<c:forEach items="${historyList}" var="history">
					<li>
						${history.content}
					</li>
				</c:forEach>	
				</ul>
			</div>

</div>
			<div class="row clearfix">
	<div class="col-md-1 column">
	</div>
				<div class="col-md-10 column">
					<div class="tabbable" id="tabs-883116">
						<ul class="nav nav-tabs">
							<li class="active">
								<a href="#panel-96319" data-toggle="tab">最新发布</a>
							</li>
							<li>
								<a href="#panel-182399" data-toggle="tab">赠送区</a>
							</li>

						</ul>
						<div class="tab-content">
						
							<div class="tab-pane active" id="panel-96319">
							<c:forEach items="${messageList}" var="message">
								<div class="col-md-4">
									<div class="thumbnail">
										<img alt="300x200" src="http://lorempixel.com/600/200/city">
										<div class="caption">
											<h3>
												${message.title}
											</h3>
											<p>
												${message.summary}
											</p>
											<p>
												<a class="btn" href="goods.html?goodsId=${message.goods.goodsId}&code=${user.code}">详情</a>
											</p>
										</div>
									</div>
								</div>
							</c:forEach>	
								
							</div>
							<div class="tab-pane" id="panel-182399">
								<div class="col-sm-6 col-md-4">
									<div class="thumbnail">
										<img data-src="holder.js/300x200" alt="..."
											src="http://lorempixel.com/140/140/">
										<div class="caption">
											<h3>
												Thumbnail label
											</h3>

											<p>
												<a href="#" class="btn btn-default" role="button">Button</a>
											</p>
										</div>
									</div>
								</div>
								<p>
									Howdy, I'm in Section 2.
								</p>
								<p>
									Howdy, I'm in Section 2.
								</p>
								<p>
									Howdy, I'm in Section 2.
								</p>
							</div>
						</div>
					</div>
				</div>
				<div class="col-md-1 column">
	</div>
			</div>

			<div class="col-md-12 column">
				<h3 class="text-center">
					(C)CopyRight 2014
				</h3>
			</div>
		</div>
	</body>
</html>
